<template>
	<view class="exchange">
		<view class="list">
			<view class="h4">兑换</view>
			<view class="flex-between picker">
				<view class="p">USDT-LK</view>
				<image src="/static/arrow.png" mode="widthFix"></image>
			</view>
			<view class="tip">LK/USDT0.1000</view>
		</view>
		<view class="list">
			<view class="flex-between">
				<view class="h4">兑换</view>
				<view class="right flex">
					可兑换数量 <view class="num">0.0000USDT</view>
				</view>
			</view>
			
			<view class="flex-between input">
				<input type="number" placeholder="输入兑换数量">
				<view class="dw-btn flex-between">
					<view class="dw">USDT</view>
					<view class="red">全部</view>
				</view>
			</view>
			<view class="tip"><text>兑换成</text>0.0000</view>
		</view>
		<button class="flex-center">兑换</button>
		<view class="warn flex">
			<icon type="info" size="20" color="#aaa"></icon>
			今日可兑额度 <text>10000.000Lk</text>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="less">
	page{
		background: white;
	}
	@color:#d4237a;
	.exchange{
		padding: 0 24rpx;
		.list{
			padding-top: 30rpx;
		}
		image{
			width: 30rpx;
			height: auto;
		}
		.h4{
			font-size: 28rpx;
			font-weight: bold;
		}
		.picker,.input{
			height: 80rpx;
			border-bottom: 1px solid #eee;
		}
		.dw-btn{
			width: 30%;
			font-size: ;
			.dw{
				width: 50%;
				
			}
		}
		.tip{
			line-height: 2.5;
			font-size: 28rpx;
			text{
				color:#999;
				margin-right: 20rpx;
			
			}
		}
		button{
			height: 80rpx;
			border-radius: 40rpx;
			background: @color;
			margin: 100rpx 0 50rpx;
			font-size: 30rpx;
			color:#fff;
		}
		.warn{
			color:#999;
			font-size: 26rpx;
			icon{
				margin-right: 25rpx;	
			}
			text{
				color:#000;
			}
		}
	}
</style>
